<template>
    <div class="list-item">
        <div class="left">
            <div class="title">
                <el-checkbox v-show="batch" v-model="checked" @change="cbChangeHandler" :disabled="!~['9'].indexOf(data.status)"></el-checkbox>

                提交信息：
            </div>

            <div class="row">
                <div class="text">
                    投标文件：
                </div>

                <upload-s ref="tbFile" :fileguid="data.fileguid" :extra="{typecode: 'tbwj', fjtype: 'tbwj',}" readonly></upload-s>
            </div>
            <div class="row">
                <div class="text">
                    招标文件：
                </div>

                <upload-s ref="zbFile" :fileguid="data.zbwjfileguid" :extra="{typecode: 'zbwj', fjtype: 'zbwj',}" readonly></upload-s>
            </div>
            <div class="row">
                <div class="text">
                    澄清文件：
                </div>

                <upload-s ref="cqFile" :fileguid="data.cqwjfileguid" :extra="{typecode: 'cqwj', fjtype: 'cqwj',}" readonly></upload-s>
            </div>
            <div class="row">
                <div class="text">
                    补遗文件：
                </div>

                <upload-s ref="byFile" :fileguid="data.bywjfileguid" :extra="{typecode: 'bywj', fjtype: 'bywj',}" readonly></upload-s>
            </div>
            <div class="row">
                <div class="text">
                    提交时间：{{data.applytime}}
                </div>
            </div>
        </div>
        <div class="right">
            <div class="title">
                <div class="left">
                    专家反馈信息：
                </div>

                <div class="right">
                    <el-button v-if="~['0', '3'].indexOf(data.status)" type="text" icon="el-icon-edit" @click="editHandler">
                        编辑
                    </el-button>

                    <el-button v-if="data.status === '9'" type="text" icon="el-icon-delete" @click="delHandler">
                        删除
                    </el-button>

                    <el-button v-if="data.status === '9'" type="text" icon="el-icon-tickets" @click="goto('/user/center/order')">
                        申请发票
                    </el-button>
                </div>
            </div>

            <template v-if="data.status !== '9'">
                <div class="row">
                    <div class="text">
                        <span v-if="data.status === '0'" class="status-yellow">
                            受理中...
                        </span>
                        <span v-if="data.status === '1'" class="status">
                            正在分配专家审查
                        </span>
                        <span v-if="data.status === '2'" class="status-green">
                            <span v-if="data.gjname">高级专家：{{data.gjname}} &nbsp;</span>
                            <span v-if="data.zjname">中级专家：{{data.zjname}}</span>
                            正在审查
                        </span>
                        <span v-if="data.status === '3'" class="status">
                            已退回：{{data.reason}}
                        </span>
                    </div>
                </div>

                <div v-if="data.status !== '3'" class="row">
                    <div class="text">
                        预计反馈时间：{{data.yjendtime}}
                    </div>
                </div>
            </template>

            <template v-if="data.status === '9'">
                <div class="row">
                    <div class="text">
                        反馈文件：
                    </div>

                    <upload-s :fileguid="data.checkfileguid" readonly btn-layout="download"></upload-s>
                </div>

                <div class="row" v-if="data.gjname">
                    <div class="text">
                        高级审查专家：{{data.gjname}}
                    </div>
                </div>
                <div class="row" v-if="data.zjname">
                    <div class="text">
                        中级审查专家：{{data.zjname}}
                    </div>
                </div>

                <div class="row">
                    <div class="text">
                        反馈时间：{{data.fktime}}
                    </div>
                </div>
            </template>
        </div>

        <my-dialog v-model="dialogVisible" title="修改提交信息" width="700px">
            <form-dialog v-if="dialogVisible" :data="data" @update="updateHandler" @cancle="dialogVisible = false"></form-dialog>
        </my-dialog>
    </div>
</template>

<script>
import UploadS from '../../../components/upload-s/index.vue';
import FormDialog from './form';

export default {
    components: {
        UploadS,
        FormDialog,
    },
    props: {
        batch: {
            type: Boolean,
            default: false,
        },
        data: {
            type: Object,
            default: () => ({}),
        },
        batchCheck: {
            type: Array,
            default: () => [],
        },
    },
    data() {
        return {
            dialogVisible: false,

            checked: false,
        };
    },
    watch: {
        batchCheck: {
            handler(val) {
                if (!~val.indexOf(this.data)) {
                    this.checked = false;
                }
            },
            deep: true,
        },
    },
    methods: {
        // 列表中复选框选中事件
        cbChangeHandler(val) {
            var arr = this.batchCheck,
                guid = this.data;

            if (val) {
                arr.push(guid);
            } else {
                var index = arr.indexOf(guid);

                arr.splice(index, 1);
            }

            this.$emit('update:batchCheck', arr);
        },
        // 编辑
        editHandler() {
            this.dialogVisible = true;
        },
        // 删除
        delHandler(row) {
            this.$emit('del', row);
        },
        // 表单更新
        updateHandler() {
            var uploads = ['tbFile', 'zbFile', 'cqFile', 'byFile'];

            uploads.forEach((item) => {
                this.$refs[item].getFileList();
            });

            this.$emit('update');

            this.dialogVisible = false;
        },
    },
};
</script>

<style scoped lang="scss">
@import '@css/var.scss';

.list-item {
    overflow: hidden;
    padding: 25px 0;
    cursor: default;
    position: relative;

    & + .list-item:before {
        content: '';
        width: 100%;
        height: 1px;
        background: #f0f0f0;
        position: absolute;
        top: 0;
    }

    .title {
        font-size: 14px;
        font-weight: 600;
        color: #333333;
        line-height: 1em;
        overflow: hidden;
        margin-bottom: 18px;

        .left {
            float: left;
            color: #333333;
        }

        .right {
            float: right;

            ::v-deep {
                .el-button--text {
                    padding: 0;
                }
            }
        }
    }

    & > .left {
        width: 60%;
        float: left;
    }

    & > .right {
        width: 40%;
        float: left;
    }

    .row {
        color: #666;
        margin-top: 6px;
        overflow: hidden;
        width: 90%;

        .text {
            float: left;
            line-height: 33px;
        }
    }

    .status {
        color: $dangerColor;
    }
    .status-yellow {
        color: #ff9000;
    }
    .status-green {
        color: #00a819;
    }
}
::v-deep .el-dialog__body {
    padding-top: 0px !important;
}
</style>